import 'package:flutter/material.dart';


///
/// Container
/// 是一个组合类容器，它本身不对应具体的RenderObject，它是DecoratedBox、ConstrainedBox、Transform、Padding、Align等组件组合的一个多功能容器，所以我们只需通过一个Container组件可以实现同时需要装饰、变换、限制的场景
/// https://api.flutter-io.cn/flutter/widgets/Container-class.html
///
class ContainerPage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("123123"),
      ),
      body: getView03(context),
    );

  }

}

getView01() {

  return Container(
    margin: EdgeInsets.only(top: 50.0, left: 120.0),
    constraints: BoxConstraints.tightFor(width: 200.0, height: 150.0),//卡片大小
    decoration: BoxDecoration(  //背景装饰
      gradient: RadialGradient( //背景径向渐变
        colors: [Colors.red, Colors.orange],
        center: Alignment.topLeft,
        radius: .98,
      ),
      boxShadow: [
        //卡片阴影
        BoxShadow(
          color: Colors.black54,
          offset: Offset(2.0, 2.0),
          blurRadius: 4.0,
        )
      ],
    ),
    transform: Matrix4.rotationZ(.2),//卡片倾斜变换
    alignment: Alignment.center, //卡片内文字居中
    child: Text(
      //卡片文字
      "5.20", style: TextStyle(color: Colors.white, fontSize: 40.0),
    ),
  );
}



getView02(){

  return Column(
    children: [
      Container(
        margin: EdgeInsets.all(20.0), //容器外补白
        color: Colors.orange,
        child: Text("Hello world!"),
      ),
      Container(
        padding: EdgeInsets.all(20.0), //容器内补白
        color: Colors.orange,
        child: Text("Hello world!"),
      ),
    ],
  );
}


getView03(BuildContext context){
  return Container(
    constraints: BoxConstraints.expand(
      height: Theme.of(context).textTheme.headline4!.fontSize! * 1.1 + 200.0,
    ),
    padding: const EdgeInsets.all(8.0),
    color: Colors.blue[600],
    alignment: Alignment.center,
    transform: Matrix4.rotationZ(0.1),
    child: Text('Hello World',
        style: Theme.of(context)
            .textTheme
            .headline4!
            .copyWith(color: Colors.white)),
  );
}